<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/include.inc.jsp" %>
<!DOCTYPE html>

<html>
<head>
    <%@include file="/WEB-INF/views/layout/miiteen/base.ref.jsp" %>
    <style>
        .input-text {
            height: 32px;
            line-height: 32px;
            -webkit-appearance: none;
            background-color: #FFF;
            background-image: none;
            border-radius: 4px;
            border: 1px solid #DCDFE6;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            color: #606266;
            display: inline-block;
            font-size: inherit;
            outline: 0;
            padding: 0 15px;
            -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
            transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
            width: 100%;
        }

        .input-text:focus {
            border-color: #409EFF;
            outline: 0;
        }
    </style>
</head>
<body>
<div class="mainpage list">
    <!--顶部菜单-->
    <div class="page-topmenu">
        <div class="btn-panel">
            <el-button type="primary" size="small" icon="el-icon-plus" @click="add">添加</el-button>
        </div>
        <div class="btn-panel">
            <el-button size="small" icon="el-icon-delete" @click="del">删除</el-button>
        </div>
    </div>
    <!--查询条件-->
    <el-form :inline="true" :model="form" size="small">

        <!--视业务进行更改-begin-->
        <el-form-item label="标题">
            <template>
                <el-select v-model="form.type" placeholder="请选择" clearable>
                    <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                    </el-option>
                </el-select>
            </template>
        </el-form-item>

        <el-form-item label="创建时间">
            <el-date-picker
                    v-model="form.createTime"
                    type="datetimerange"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
            </el-date-picker>
        </el-form-item>
        <!--视业务进行更改-end-->

        <el-form-item>
            <el-button type="primary" @click="search">查询</el-button>
        </el-form-item>
    </el-form>
    <hr/>
    <el-table
            row-key="id"
            :data="grid.data"
            :height="grid.height"
            @selection-change="selectchange">
        <el-table-column
                type="selection"
                width="55">
        </el-table-column>
        <el-table-column prop="name" label="操作" width="100">
            <template slot-scope="scope">
                <a @click="goedit(scope.row.id)" class="grid-operate">编辑</a>
            </template>
        </el-table-column>

        <!--视业务进行更改-begin-->
        <el-table-column prop="type" label="标题">
            <template slot-scope="scope">
                {{scope.row.type == 1 ? "兰州概况" : "光荣榜"}}
            </template>
        </el-table-column>
        <el-table-column prop="discription" label="描述"></el-table-column>
        <%--<el-table-column prop="image" label="图片">--%>
            <%--<template slot-scope="scope">--%>
                <%--<el-popover placement="right" title="" trigger="hover">--%>
                    <%--<img :src="scope.row.image" style="max-height: 400px;max-width: 300px"/>--%>
                    <%--<img slot="reference" :src="scope.row.image" :alt="scope.row.image"--%>
                         <%--style="max-height: 50px;max-width: 130px">--%>
                <%--</el-popover>--%>
            <%--</template>--%>
        <%--</el-table-column>--%>
        <el-table-column prop="remark" label="备注"></el-table-column>
        <el-table-column prop="deptName" label="部门"></el-table-column>
        <el-table-column prop="creator" label="创建人"></el-table-column>
        <el-table-column prop="createTime" label="创建时间"></el-table-column>
        <!--视业务进行更改-end-->

    </el-table>
    <!--分页控件-->
    <%@include file="/WEB-INF/views/layout/miiteen/gridpage.ref.jsp" %>
</div>
<script>
    //初始化数据，必须放置在列表页面封装部分前
    function initVueOption(obj) {
        //设置控制器
        obj.data.controller = "${ctx}/basic/basicoverview";
        //设置查询条件默认值
        obj.data.form = {
        }

        obj.data.options=[
            {
                value:1,
                label:"兰州概况",
            },
            {
                value:2,
                label:"光荣榜",
            }
        ]
    }
</script>
<!--列表页面封装部分-->
<%@include file="/WEB-INF/views/layout/miiteen/page.list.ref.jsp" %>
</body>
</html>
